import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:hitutor/Util/DateUtil.dart';
import 'package:hitutor/Util/Global.dart';
import 'package:hitutor/Util/MyColor.dart';
import 'package:hitutor/Util/PageUtil.dart';
import 'package:hitutor/Widget/MyImage.dart';
import 'package:hitutor/Widget/TriangleCustomPainter.dart';

class ReviewLiveChat extends StatefulWidget {
  List<dynamic> chatList = [];

  ReviewLiveChat(this.chatList);

  @override
  State<StatefulWidget> createState() {
    return _ReviewLiveChat();
  }
}

class _ReviewLiveChat extends State<ReviewLiveChat> {
  List<dynamic> showList = [];

  @override
  void initState() {
    for (var item in widget.chatList) {
      var date = {};
      date["date"] = item["clientDate"];
      showList.add(date);
      for (var item2 in item["messageList"]) {
        item2["date"] = "";
        showList.add(item2);
      }
    }
    print(showList);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
        decoration: Global.getWhiteBg(8),
        padding: EdgeInsets.fromLTRB(8, 8, 8, 0),
        child: Column(children: [
          Container(
              child: Row(crossAxisAlignment: CrossAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
            Container(width: 38),
            Text("Live Chat", style: TextStyle(fontSize: 18, color: Color(0xff2e4f90), fontWeight: FontWeight.bold)),
            LocalImage("cross_gray.png", width: 22, padding: EdgeInsets.all(8), onTap: () {
              PageUtil().back(context);
            })
          ])),
          Expanded(
              child: ListView.builder(
                  itemCount: showList.length,
                  padding: EdgeInsets.symmetric(vertical: 8),
                  itemBuilder: (BuildContext context, int index) {
                    if (showList[index]["date"].toString().isNotEmpty) {
                      return Time(showList[index]["date"]);
                    }
                    if (showList[index]["isStudent"]) {
                      return rightMsg(showList[index]);
                    } else {
                      return leftMsg(showList[index]);
                    }
                  }))
        ]));
  }
}

class Time extends StatelessWidget {
  String time;

  Time(this.time);

  @override
  Widget build(BuildContext context) {
    return Row(children: [
      Expanded(child: Container(color: Color(0xffc2c1c2), height: 1)),
      Text("　${time}　", style: TextStyle(fontSize: 12, color: Color(0xff808080))),
      Expanded(child: Container(color: Color(0xffc2c1c2), height: 1)),
    ]);
  }
}

class rightMsg extends StatelessWidget {
  dynamic message;

  rightMsg(this.message);

  @override
  Widget build(BuildContext context) {
    String time = getStrTime(getTimeByUtc(message["messageSendTime"]), DateUtil.HM);

    return Container(
        margin: EdgeInsets.only(top: 12),
        child: Row(crossAxisAlignment: CrossAxisAlignment.end, children: [
          Container(
              margin: EdgeInsets.only(right: 8, left: 36), child: Text("$time", style: TextStyle(fontSize: 12, color: Color(0xffaeaeae)))),
          Expanded(
              child: Row(crossAxisAlignment: CrossAxisAlignment.start, children: [
            Expanded(
                child: Container(
                    decoration: Global.getBg(Color(0xffebebeb), 6),
                    padding: EdgeInsets.all(12),
                    child: Text("${message["message"]}", style: TextStyle(fontSize: 14, color: Color(0xff808080))))),
            Container(margin: EdgeInsets.only(top: 8), child: rightTriangle())
          ]))
        ]));
  }
}

class leftMsg extends StatelessWidget {
  dynamic message;

  leftMsg(this.message);

  @override
  Widget build(BuildContext context) {
    String time = getStrTime(getTimeByUtc(message["messageSendTime"]), DateUtil.HM);

    return Container(
        margin: EdgeInsets.only(top: 12),
        child: Row(crossAxisAlignment: CrossAxisAlignment.end, children: [
          Expanded(
              child: Row(crossAxisAlignment: CrossAxisAlignment.start, children: [
            NetImage("${message["teacherPhoto"]}", width: 32, height: 32, radius: 16, fit: BoxFit.cover),
            Container(child: leftTriangle(), margin: EdgeInsets.only(top: 8, left: 4)),
            Expanded(
                child: Container(
                    decoration: Global.getBg(Color(0xffe3f2f8), 6),
                    padding: EdgeInsets.all(12),
                    child: Text("${message["message"]}", style: TextStyle(fontSize: 14, color: Color(0xff808080)))))
          ])),
          Container(margin: EdgeInsets.only(left: 8), child: Text("$time", style: TextStyle(fontSize: 12, color: Color(0xffaeaeae)))),
        ]));
  }
}
